<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <script type="text/javascript" src="./js/jquery-3.6.0.min.js"></script>
    <title>用户数据</title>
</head>
<body>
<div>
    <table width="600" border="1" cellspacing="0">
        <thead>
        <tr>
            <th>账号</th>
            <th>密码</th>
            <th>积分</th>
            <th>状态</th>
        </tr>
        </thead>
        <tbody id="tbMain"></tbody>
    </table>
</div>
</body>
<script type="text/javascript">
    let data = {
    }
    $.ajax({
        url: 'http://localhost:8080/data',
        type: "POST",
        data: JSON.stringify(data),
        success:function(res){
            console.log(res);
            let tbody = document.getElementById('tbMain');
            for (let i = 0; i < res.length; i++){
                tbody.appendChild(getDataRow(res[i]));
            }
        },
        error:function (){
            console.log("请求出错")
        }
    })

    function getDataRow(o){
        let row = document.createElement('tr');

        let name = document.createElement('td');
        name.innerHTML = o.userName;
        row.appendChild(name);

        let password = document.createElement('td');
        password.innerHTML = o.password;
        row.appendChild(password);

        let points = document.createElement('td');
        points.innerHTML = o.points;
        row.appendChild(points);

        let status = document.createElement('td');
        status.innerHTML = o.status;
        row.appendChild(status);

        return row;
    }
</script>
</html>